// $minWidth:100px;
// $minHeight:200px;
// $mainColor:red;
// div{
// 	width: $minWidth;
// 	height: $minHeight;
// 	$content: "菜就多练"
// 	div::before{
// 		content: $content;
// 	}
// }

// $size: 200px;
// .box1{
// 	width: $size;
// 	height: $size;
// 	background-color: brown;
	
// 	.inner_box{
// 		width: $size - 60px;
// 		height: $size - 60px;
// 		transition: all 0.5s;
// 		background-color: darkcyan;
// 		&:hover{
// 			background-color: red;
// 		}
// 	}
// 	// 选择器拼接
// 	&_title{
// 		color: blue;
// 	}
// }

// .box2{
// 	@extend .box1;
// 	background-color: bisque;
// }


// ---------------判断
// $count: 10;
// $text: '菜';
// $color1: orange;
// $color2: red;
// .box1{
// 	margin: 0 auto;
// 	height: 100px;
// 	width: 200px;
// 	@if not false {
// 		background-color: $color1;
// 	}@else{
// 		background-color: $color2;
// 	}
// }

// $a:12;
// $b:200px;
// body{
// 	width: $a/2;
// 	height: $b+$a/2;
// 	font-size: ($b/$a);
// 	content: ser + "asdfa";
// 	sedf: 'var' + asdf;
// 	asdf: 'asdf' + ASDF;
// 	FG: ASDF + 'adsf';
// 	adfgh: 50% - $a;
// }


// $family:family;
// $size:20px;
// $author: '菜鸡';
// /**
//  * 作者 #{$author}
//  */
// el{
// 	width: $size;
// 	height: $size;
// 	font-#{$family}: $author;
// }



// for循环
// @for $i from 1 to 6{
// 	div#{$i}{
// 		width: #{$i}px;
// 	}
// }

// each
// $colors: red blue green orange purple;
// @each $var in $colors {
// 	$index: index($colors, $var);
// 	span#{$index}{
// 		color: $var;
// 	}
// }


// while
// $count: 11;
// @while $count > 0{
// 	span#{$count}{
// 		width: 13px;
// 	}
// 	$count: $count - 1;
// }


// import
// @import '__common.scss';
// div{
// 	width: 12px;
// }

// 混入
// @mixin name($color,$width,$height) {
// 	width: $width;
// 	height: $height;
// 	color: $color;
// }
// div{
// 	@include name(red, 20px, 20px)
// }
// span{
// 	@include name(yellow, 30px, 30px)
// }

// 函数
@function sum($a,$b){
	@return $a + $b;
}
p{
	width: sum(10px, 12px);
}